<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>管理讲座预约</title>
    <script src="/js/vue.global.js"></script>
    <script src="/js/axios.min.js"></script>
</head>
<body id = "app">
<div>
    <h1>欢迎来到首页</h1>
    <!--判断用户登录-->
    <span v-if="this.admin.id==-1">
        <span> <a href="/admin/registration.html">   注册</a></span>
        <span>  <a href="/admin/login.html">  登录</a></span>
    </span>
    <span v-if="this.admin.id!=-1">
        <span v-text="'用户：'+this.admin.name"></span>
        <span> &nbsp;&nbsp;<a href="/orders.html">讲座管理</a> &nbsp;&nbsp;</span>
        <span >  &nbsp;&nbsp;<button v-on:click="this.unlogin()">&nbsp;退出 </button></span>
    </span>
</div>
<script>
    //定义app
    const app = {

        //数据绑定
        data() {
            return {
                text: 'hello vue!',

                //已经登录的用户
                manage: {id: -1},

            }
        },
        //事件绑定
        methods: {

            //获取登录用户
            getLoginAdmin: function () {
                axios({
                    method: "post", url: "/getLoginAdmin", data: {}
                }).then((response) => {
                    this.users = response.data
                });
            },
            //退出登录
            adminunlogin: function () {
                axios({
                    method: "post", url: "/adminunlogin", data: {}
                }).then((response) => {
                    if(response.data==='ok') {
                        window.location.reload() //刷新
                    }
                });
            },


        },

        //构造方法
        mounted() {
            console.log("vue启动成功！")
            this.getLoginUser()
        }
    }

    //启动app
    Vue.createApp(app).mount("#app")
</script>
</body>
</html>